define(['ldfw/core','text!tpl/comps/file-uploader.tpl','art','weui','jquery-weui','ldfw/utils/format'],
    function(LDFW,tpl,art,weui){
    const fileTpl = `<li class="weui-uploader__file" data-id="{{id}}" style="background-image:url({{url}})" ></li>`
    return LDFW.Component.extend({
        events:{
            'click .weui-uploader__file':'deleteUploader'
        },
        initialize:function(){
            const _this = this
            let title = this.$el.attr('title'),
                accept = this.$el.attr('accept'),
                multiple = this.$el.attr('mutiple'),
                type = this.$el.attr('type'),
                cust_no = this.$el.attr('cust_no'),
                relation_field = this.$el.attr('relation_field'),
                disabled = this.$el.attr('disabled')
            this._id = 0;
            this._files = []
            this._config = {
                url: '/fileUpload.do',
                auto:true,
                display:'inline-block',
                title:'附件上传',
                info:'',
                accept:'images/*',
                multiple:true,
                type:'file',
                fileVal:'file',
                uploaderFilesId:uuid('uploaderCustomFiles'),
                uploaderInputId:uuid('uploaderCustomInput'),
                onBeforeSend: function(data, headers){
                    $.extend(data, { cust_no:cust_no,relation_field:relation_field}); // 可以扩展此对象来控制上传参数
                },
                onSuccess:function(ret){
                    if(ret.result && ret.result.length){
                        this.fileId = ret.result[0]
                        _this._files.push(this)
                    }
                },
                onError:function(err){
                    console.log(this, err);
                }
            }
            if(title){
                this._config.title = title
            }
            if(accept){
                this._config.accept = accept
            }
            if(typeof multiple!=='undefined'){
                this._config.multiple = true
            }
            if(typeof disabled!=='undefined'){
                this._config.display = 'none'
            }
            this.$el.append(art.compile(tpl)(this._config))
            weui.uploader(this.$el[0],this._config)
        },

        readBlobAsDataURL(blob, callback) {
            var a = new FileReader();
            a.onload = function(e) {callback(e.target.result);};
            a.readAsDataURL(blob);
        },
        deleteUploader:function(e){
            const _this = this
            $.confirm('确认要删除这张图片？','删除',
                function(){
                    let dataId = $(e.target).attr('data-id')
                    $(e.target).remove()
                    for(let i = 0; i<_this._files.length;i++){
                        if(_this._files[i].id == dataId){
                            _this._files.splice(i,1)
                            break;
                        }
                    }
                })
        },
        // uploaderChange:function(event){
        //     const _this = this
        //     let $uploadFiles = this.$el.find('#'+this._config.uploaderFilesId)
        //     let files = event.target.files;
        //     Array.prototype.forEach.call(files,function(file,index){
        //         file.id = ++_this._id
        //         $uploadFiles.append(art.compile(fileTpl)(file))
        //         _this.readBlobAsDataURL(file,function(blob){
        //             if(blob){
        //                 _this.setUploadFile(file,blob);
        //             }
        //         })
        //     })
        // },

        // setUploadFile:function(file,blob){
        //     let $uploadFiles = this.$el.find('#'+this._config.uploaderFilesId)
        //     file.url = URL.createObjectURL(file);
        //     file.status = 'ready';
        //     var $file = $uploadFiles.find('[data-id="' + file.id + '"]');
        //     $file.css({
        //         backgroundImage: 'url("' + (file.base64 || file.url) + '")'
        //     })
        //     if(this._config.auto) file.upload()
        // },

        // upload:function(){
        //     this.$uploader.upload()
        // },
        updateModel: function (model,val) {
            const _this = this
            let $uploadFiles = this.$el.find('#'+this._config.uploaderFilesId)
            if(val && val.trim()){
                let fileList = val.split(';')
                fileList.forEach(function(item,index){
                    if(item){
                        let id = item.substring(0,item.indexOf(':'))
                        let name = item.substring(item.indexOf(':')+1)
                        $uploadFiles.append(
                            art.compile(fileTpl)({id:id,url:'/show_img.do?fileId='+id})
                        )
                        _this._files.push({id:id,fileId:id,name:name})
                    }
                })
            }
        },
        getValue: function () {
            let files = []
            this._files.forEach(function(file,index){
                files.push(file.fileId+':'+file.name)
            })
            return files.join(';')
        }

    })
})